<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <title>注册页面</title>
  <!--    引入格式文件-->
  <link rel="stylesheet" href="./css/reg.css" />

</head>

<body>
  <style></style>
  <div class="rg_layout">
    <div class="rg_left">
      <p>新用户注册</p>
      <p>USER REGISTER</p>
    </div>
    <div class="rg_center">
      <div class="rg_form">
        <form action="#" method="post">
          <table>
            <tr>
              <td class="td_left"><label for="username">用户名</label></td>
              <td class="td_right">
                <input type="text" id="username" />
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="password">密码</label></td>
              <td class="td_right">
                <input type="password" id="password" />
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="phone">手机号</label></td>
              <td class="td_right">
                <input type="text" id="phone" />
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="">性别</label></td>
              <td class="td_right">
                <label><input type="radio" name="sex" value="1" checked />男</label>&nbsp;&nbsp;&nbsp;
                <label><input type="radio" name="sex" value="0" />女</label>
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="">是否VIP</label></td>
              <td class="td_right">
                <label><input type="radio" name="vip" value="1" />是</label>&nbsp;&nbsp;&nbsp;
                <label><input type="radio" name="vip" value="0" checked />否</label>
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="question">密保问题</label></td>
              <td class="td_right">
                <input type="text" id="question" />
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="answer">密保答案</label></td>
              <td class="td_right">
                <input type="text" id="answer" />
              </td>
            </tr>
            <tr>
              <td class="td_left"><label for="avatar">头像</label></td>
              <td class="td_right">
                <input type="text" id="avatar" disabled />
                <button>选择图片</button><input type="file" hidden />
              </td>
            </tr>
            <tr>
              <td colspan="2" align="center">
                <input type="submit" value="立即注册" id="btn_sub" />
              </td>
            </tr>
          </table>
        </form>
      </div>
    </div>
    <div class="rg_right">
      <p>已有账号？<a href="">立即登录</a></p>
    </div>
  </div>
  <br />
  <script src="/jquery.js"></script>
  <script src="/axios.js"></script>
  <script>
    // $(function(){
    //   $('form').on('submit',function(e){
    //   e.preventDefault()
    //   const username = $('#username').val().trim()
    //   const password = $('#password').val().trim()
    //   const phone = $('#phone').val().trim()
    //   const question = $('#question').val().trim()
    //   const answer = $('#answer').val().trim()
    //   // const oppo = $('form').serialize()

    //   const sex = $('[checked]')[0].value
    //   const vip = $('[checked]')[1].value

    //   if(username.length<= 0 || password.length <= 0 || phone.length <= 0  || question.length <= 0 || answer.length <= 0) return alert('请输入内容！')

    //   $.ajax({
    //     method:'post',
    //     url:'http://124.223.14.236:3001/api/user/reg',
    //     data:{
    //       username:username,password:password,phone:phone,question:question,answer:answer,
    //       // oppo
    //       sex,vip
    //     },
    //     success:function(res){
    //       console.log(res);
    //       $('#username').val('')
    //       $('#password').val('')
    //       $('#phone').val('')
    //       $('#question').val('')
    //       $('#answer').val('')
    //     }
    //   }) 
    // })
    // })

    const form = document.querySelector('form')

    form.addEventListener('submit', async function (e) {
      e.preventDefault()

      let username = form.username.value
      let password = form.password.value
      let phone = form.phone.value
      let question = form.question.value
      let answer = form.answer.value
      let sex = form.sex.value
      let vip = form.vip.value


      const res = await axios.post('http://124.223.14.236:3001/api/user/reg', {
        username,
        password,
        phone,
        question,
        answer,
        sex: Number(sex),
        vip: Number(vip)
      })
      console.log(res);
      location.href = '/01-loginBaseCode/login.html'
    })


  </script>
</body>

</html>